<template>
  <view class="page-content user-center">
    <cu-custom bg-color="baseColor2Bg">
      <!-- <block slot="left">
        <navigator :url="$RouterPath.MessageCenter">
          <text class="cuIcon-settingsfill head-left"></text>
        </navigator>
      </block>-->
      <block slot="content">我的</block>
      <!-- <block slot="right">
        <view class="action">
          <navigator :url="$RouterPath.MessageCenter">
            <text class="cuIcon-message head-right"></text>
          </navigator>
        </view>
      </block>-->
    </cu-custom>
    <!-- acc info -->
    <view class="mem-panel baseColor2Bg">
      <view class="flex-row mem-info">
        <view class="head-block">
          <image class="cu-avatar xl round" :src="memberInfo.headPortrait" />
        </view>
        <view class="nick-level">
          <label class="level">会员等级</label>
          <text class="nick-name">小童鞋</text>
        </view>
        <view class="acc-balances">
          <image src="../../static/images/erweima.png" class="erweima" />
          <text class="acc-balances-text">分享二维码</text>
        </view>
      </view>
      <view class="cu-list grid col-3 mt-1 no-border text-black">
        <view class="cu-item">
          <view>
            <text>100</text>
          </view>
          <text>预约记录</text>
        </view>
        <view class="cu-item">
          <view>
            <text>100</text>
          </view>
          <text>领养记录</text>
        </view>
        <view class="cu-item">
          <view>
            <text>100</text>
          </view>
          <text>转让记录</text>
        </view>
      </view>
    </view>
    <view class="panel-title" />
    <view class="agent-panel baseColor2Bg">
      <view class="cu-list grid col-4 mt-1 no-border">
        <view
          class="cu-item"
          v-for="(item ,index) in agentItemRowList"
          :key="index"
          @click="navigateTo(item)"
        >
          <view :class="['cuIcon-' + item.icon,'text-' + item.color]"></view>
          <text>{{item.name}}</text>
        </view>
      </view>
    </view>
    <view class="panel-title" />
    <view v-for="(item, index) in msgData" :key="index">
      <view class="cu-list menu" :class="[
       
		'msg-list'
      ]">
        <view class="cu-item">
          <view class="content">
            <text :class="['cuIcon-' + item.icon,'text-' + item.color]"></text>
            <text class="text-grey">{{item.value}}</text>
          </view>
          <text class="cuIcon-right text-grey"></text>
        </view>
      </view>
    </view>
  </view>
</template>
<script>
export default {
  data() {
    return {
      isLoad: true,
      memberInfo: {
        headPortrait: this.$store.state.memberInfo.headPortrait,
        userType: 100,
        userAlias: "13344445555",
        password: "111111"
      },

      agentItemRowList: [
        {
          name: "我的钱包",
          icon: "refund",
          color: "blue",
          navigateUrl: this.$RouterPath.Recharge,
          isTabbar: true
        },
        {
          name: "充值",
          icon: "vipcard",
          color: "blue",
          navigateUrl: this.$RouterPath.Recharge
        },
        {
          name: "收款信息",
          icon: "barcode",
          color: "green",
          navigateUrl: this.$RouterPath.Recharge
        },
        {
          name: "安全管理",
          icon: "circlefill",
          color: "yellow",
          navigateUrl: this.$RouterPath.Recharge,
          isTabbar: true
        },
        {
          name: "我的通讯录",
          icon: "sort",
          color: "blue",
          navigateUrl: this.$RouterPath.Recharge
        },
        {
          name: "设置",
          icon: "calendar",
          color: "red",
          navigateUrl: this.$RouterPath.Recharge
        }
      ],
      msgData: [
        {
          value: "密码修改",
          icon: "goodsfill",
          color: "blue"
        },
        {
          value: "安全密码修改",
          icon: "goodsfill",
          color: "blue"
        }
      ]
    };
  },
  methods: {
    navigateTo: function(item) {
      uni["navigateTo"]({
        url: item.navigateUrl
      });
    },
    onLoad() {}
  }
};
</script>

<style scoped>
@import "../../static/css/user-center.css";
page {
  background: #406fa0;
}
.erweima {
  width: 60rpx;
  height: 60rpx;
}
.acc-balances-text {
  font-size: 16rpx;
  margin-top: 10rpx;
}
.cu-list.menu > .cu-item {
  background-color: #033e7a;
  color: #ffffff;
}
</style>
